<template>
	<div class="page_index">
		<div class="banner">
			<p class="banner_title">脚踏实地，行稳致远，进而有为。</p>
			<p class="banner_text">欢迎回来！{{ userInfo.nickName }}</p>
		</div>
		<el-button type="primary" @click="test">测试token</el-button>
	</div>
</template>

<script setup lang="ts">
import { useLoginStore } from '@/store/login/login'
import { testToken } from '@/service/login/login'
import { ElMessage } from 'element-plus'

const loginStore = useLoginStore()
const userInfo = loginStore.userInfo

async function test() {
	await testToken()
	ElMessage.success('测试token成功')
}
</script>

<style lang="less" scoped>
.banner {
	width: 100%;
	height: 220px;
	text-align: center;
	margin-bottom: 20px;
	border-radius: 10px;
	background: url('@/assets/img/other/index_banner.png') no-repeat center;
	background-size: 100% auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	.banner_title {
		color: #fff;
		font-size: 40px;
		font-weight: bold;
		text-shadow: 2px 2px 2px #409eff;
		opacity: 0.9;
	}
	.banner_text {
		color: #fff;
		margin-top: 20px;
		font-size: 24px;
	}
}
</style>
